<template>

	<view>
		<view class="content">
			<z-paging ref="paging" :refresher-only="true" :fixed="true" :show-loading-more-no-more-view='false'
				:refresher-enabled="false" :refresher-threshold="0" hide-refresher-when-reload
				hide-refresher-when-enabled>
				<template #top>
					<u-navbar :fixed="false" title="模具维修" :autoBack="true" :safeAreaInsetTop="true"
						@leftClick='leftClick' leftIconColor="#fff"></u-navbar>
				</template>

				<view class="MainBox">
					<u--form labelPosition="left" :model="baseFormData" :rules="rules" ref="uForm">

						<u-cell icon="list-dot" title="申请人填写" style='background-color: #eee;'></u-cell>

						<u-form-item labelWidth="100" label="模具" borderBottom leftIcon="file-text" required
							prop='MoludName' :leftIconStyle="{'font-size':'20px'}"
							@click="openBaseScreen('模具','radio')">
							<u--input v-model="baseFormData.MoludName" placeholder="请选择模具" readonly
								border="none"></u--input>
							<u-icon slot="right" name="arrow-right"></u-icon>
						</u-form-item>
						<u-form-item labelWidth="100" label="申请人" borderBottom leftIcon="order"
							:leftIconStyle="{'font-size':'20px'}">
							<u--input v-model="baseFormData.ApplyForMan" placeholder="自动生成" readonly
								border="none"></u--input>
						</u-form-item>
						<u-form-item labelWidth="100" label="申请时间" borderBottom leftIcon="calendar"
							:leftIconStyle="{'font-size':'20px'}">
							<u--input v-model="baseFormData.ApplyForTime" placeholder="自动生成" readonly
								border="none"></u--input>
						</u-form-item>
						<u-form-item labelWidth="100" label="故障描述" borderBottom leftIcon="file-text" required
							prop="BXContent" :leftIconStyle="{'font-size':'20px'}">
							<!-- 	<u--input v-model="baseFormData.BXContent" placeholder="请输入故障描述" border="none"
								:readonly="!buttonShow"></u--input> -->

							<u--textarea v-model="baseFormData.BXContent" placeholder="请输入故障描述" border="none" autoHeight
								:style="{backgroundColor:!buttonShow?'#fff':''}" style="padding: 0;"
								:disabled="!buttonShow"></u--textarea>
						</u-form-item>

						<u-cell icon="list-dot" v-show="buttonTitle!='保存'" title="维修人填写"
							style='background-color: #eee;'></u-cell>
						<u-form-item labelWidth="100" label="维修编号" borderBottom leftIcon="order"
							v-show="buttonTitle!='保存'" :leftIconStyle="{'font-size':'20px'}">
							<u--input v-model="baseFormData.BillNO" placeholder="自动生成" readonly
								border="none"></u--input>
						</u-form-item>
						<u-form-item labelWidth="100" label="维修人" borderBottom leftIcon="file-text"
							v-show="buttonTitle!='保存'" :prop="buttonTitle == '开始维修'?'MaintainMan':''" required
							:leftIconStyle="{'font-size':'20px'}" @click="openBaseScreen('维修人员','radio')">
							<u--input v-model="baseFormData.MaintainMan" placeholder="请选择人员" readonly border="none"
								required></u--input>
							<u-icon slot="right" name="arrow-right"></u-icon>
						</u-form-item>

						<u-form-item labelWidth="100" label="维修内容" borderBottom leftIcon="file-text" required
							v-show="buttonTitle!='保存'" :prop="buttonTitle == '开始维修'?'GZCause':''"
							:leftIconStyle="{'font-size':'20px'}">
							<!-- 		<u--input v-model="baseFormData.GZCause" placeholder="请输入维修内容" border="none"
								:readonly="!buttonShow"></u--input> -->
							<u--textarea v-model="baseFormData.GZCause" placeholder="请输入维修内容" border="none" autoHeight
								:style="{backgroundColor:!buttonShow?'#fff':''}" style="padding: 0;"
								:disabled="!buttonShow"></u--textarea>

						</u-form-item>
						<u-form-item labelWidth="100" label="维修方式" borderBottom leftIcon="file-text"
							v-show="buttonTitle!='保存'" :prop="buttonTitle == '开始维修'?'WayName':''" required
							:leftIconStyle="{'font-size':'20px'}" @click="addWay('WXFS')">
							<u--input v-model="baseFormData.WayName" placeholder="请选择维修方式" border="none"
								readonly></u--input>
							<u-icon slot="right" name="arrow-right"></u-icon>
						</u-form-item>
						<u-form-item labelWidth="100" label="维修费用" borderBottom leftIcon="coupon"
							v-show="buttonTitle!='保存'" :prop="buttonTitle == '结束维修'?'Cost':''"
							:required='buttonTitle == "结束维修"'
							:leftIconStyle="{'font-size':'20px','color':buttonTitle == '开始维修'?'#999999':'#000'}">
							<u--input v-model="baseFormData.Cost"
								:placeholder="buttonTitle == '结束维修' ?'请输入维修费用':'请在结束时填写'" type='number' border="none"
								:readonly="!buttonShow|| buttonTitle == '开始维修'"></u--input>
						</u-form-item>

						<u-form-item labelWidth="100" label="维修状态" borderBottom leftIcon="order"
							v-show="buttonTitle!='保存'" :leftIconStyle="{'font-size':'20px'}">
							<u--input v-model="baseFormData.MaintenanceStatusName" placeholder="自动带出维修状态" border="none"
								readonly></u--input>

						</u-form-item>

						<u-form-item labelWidth="100" label="维修结果" borderBottom leftIcon="file-text"
							:prop="buttonTitle == '结束维修'?'FResultName':''" v-show="buttonTitle!='保存'"
							:required='buttonTitle == "结束维修"'
							:leftIconStyle="{'font-size':'20px','color':buttonTitle == '开始维修'?'#999999':'#000'}"
							@click="addWay1('SBWX')">
							<u--input v-model="baseFormData.FResultName"
								:placeholder="buttonTitle == '结束维修' ?'请选择维修结果':'请在结束时填写'" border="none"
								readonly></u--input>
							<u-icon slot="right" name="arrow-right"></u-icon>
						</u-form-item>
						<u-form-item labelWidth="100" label="开始时间" borderBottom leftIcon="calendar"
							v-show="buttonTitle!='保存'" :leftIconStyle="{'font-size':'20px'}">
							<u--input v-model="baseFormData.BeginTime" placeholder="自动带出开始时间" readonly
								border="none"></u--input>
						</u-form-item>
						<u-form-item labelWidth="100" label="结束时间" leftIcon="calendar" v-show="buttonTitle!='保存'"
							:leftIconStyle="{'font-size':'20px'}">
							<u--input v-model="baseFormData.WCTime" placeholder="自动带出结束时间" readonly
								border="none"></u--input>
						</u-form-item>
					</u--form>

				</view>
				<template #bottom>
					<view class="BottomBox" :style="$utils.disposeSafeBottomFun()" v-show="buttonShow">
						<button block @click="submit" style="width: 90%;margin: 0 auto !important;"
							class="content_bottom_primary_Btn">
							{{buttonTitle}}
						</button>
					</view>

				</template>
			</z-paging>


		</view>
		<u-toast ref="uToast"></u-toast>
		<u-action-sheet :actions="producplnameList" :show="producplnameShow" @select="producplnameClick"
			@close="producplnameShow=false"></u-action-sheet>
		<u-action-sheet :actions="StateList" :show="StateShow" @select="StateClick"
			@close="StateShow=false"></u-action-sheet>
	</view>


</template>

<script>
	import {
		getTimeStamp,
		getFormatDateTime,
		getBefore7DateTime
	} from '@/st_device/common/base.js';
	export default {
		data() {
			return {
				rules: {

					'MoludName': {
						type: 'string',
						required: true,
						message: '模具不能为空',
						trigger: ['change']
					},
					'BXContent': {
						type: 'string',
						required: true,
						message: '故障描述不能为空',
						trigger: ['change']
					},
					'MaintainMan': {
						type: 'string',
						required: true,
						message: '人员不能为空',
						trigger: ['change']
					},
					'GZCause': {
						type: 'string',
						required: true,
						message: '维修内容不能为空',
						trigger: ['blur', 'change']
					},
					'WayName': {
						type: 'string',
						required: true,
						message: '维修方式不能为空',
						trigger: ['change']
					},
					'Cost': {
						type: 'number',
						required: true,
						message: '维修费用不能为空',
						trigger: ['blur', 'change']
					},
					'FResultName': {
						type: 'string',
						required: true,
						message: '维修结果不能为空',
						trigger: ['change']
					}
				},

				baseFormData: {
					MoludID: null,
					MoludName: '',

					ApplyForMan: '',
					ApplyForTime: '',
					BXContent: '',
					BillNO: '',
					MaintainMan: '',
					GZCause: '',
					Way: '',
					WayName: '',
					Cost: '',
					WCStatus: '',
					FResult: 0,
					FResultName: '',
					BeginTime: '',
					WCTime: '',
					BillDate: '',
					ProcessNode: null,
					MaintenanceStatus: null,
					MaintenanceStatusName: ''

				},
				FormData: {
					CostName: ''
				},
				sexs: [{
					text: '合格',
					value: 0
				}, {
					text: '不合格',
					value: 1
				}],
				buttonShow: true,
				buttonTitle: '保存',
				tableData: [],

				StateShow: false,
				StateList: [],
				producplnameIndex: 0,
				producplnameShow: false,
				producplnameList: [],


				popup_logout: false,
				popuptitle: '',
				popupcontent: '',
				MoludList: []
			};
		},
		onLoad(item) {
			var that = this

			if (item.MaintainMouldID) {
				that.queryList(item.MaintainMouldID)
			} else {
				if (item.item) {
					var item = JSON.parse(item.item)
					console.log(item);
					this.baseFormData = item
					this.baseFormData.BXContent = this.baseFormData.BXContent = item.FaultName + ':' + item.GZContent
				}
				this.baseFormData.ApplyForMan = this.baseFormData.ApplyForMan ? this.baseFormData.ApplyForMan : this
					.$store.state.UserInfo.UserName
				this.baseFormData.CheckupID = this.baseFormData.CheckupID ? this.baseFormData.CheckupID : this.$store
					.state.UserInfo.EmplID
				this.baseFormData.ApplyForTime = this.baseFormData.ApplyForTime ? this.baseFormData.ApplyForTime :
					getFormatDateTime(new Date())
				this.baseFormData.BillDate = this.baseFormData.BillDate ? this.baseFormData.BillDate :
					getFormatDateTime(new Date())
			}
		},
		onBackPress(options) { // 监听页面返回
			if (options.from == 'navigateBack') { // 通过点击路由返回
				return false;
			} else if (options.from == 'backbutton') { // 通过外置返回
				return true;
			}
		},
		onUnload() { // 监听页面卸载,
			// 关闭监听器

			uni.$off('devicerepairDetail_Choice');

		},
		mounted() {
			var that = this;
			uni.$on('devicerepairDetail_Choice', function(ret) {
				console.log(JSON.stringify(ret))
				if (ret.type == '维修人员') {
					that.baseFormData.MaintainMan = ret.data.EmplName
					that.$refs.uForm.validateField('MaintainMan');
				} else if (ret.type == '模具') {
					that.baseFormData.MoludID = ret.data.MoludID
					that.baseFormData.MoludName = ret.data.MoludCode
					that.$refs.uForm.validateField('MoludName');
				}


			});
		},
		onShow() {

		},
		methods: {

			getBYStatus(value) {
				switch (value) {
					case -1:
						return '全部';
					case 0:
						return '未维修';
					case 1:
						return '维修中';
					default:
						return '已维修';
				}
			},

			confirmClick() {
				this.popup_logout = false
			},
			addPeriodTypeClick() {
				var that = this
				if (that.baseFormData.ProcessNode == 1 && that.baseFormData.MaintenanceStatus == 0) {

					that.buttonTitle = '开始维修'
				} else if (that.baseFormData.ProcessNode == 1 && that.baseFormData.MaintenanceStatus == 1) {

					that.buttonTitle = '结束维修'
				} else if (that.baseFormData.ProcessNode == 2 && that.baseFormData.MaintenanceStatus == 2) {
					that.buttonTitle = '已维修'
				}

				if (that.baseFormData.MaintainMouldID && that.baseFormData.BeginTime && that.baseFormData
					.WCTime) {
					that.buttonShow = false
				}
				that.$forceUpdate()
			},
			trash(index) {
				var that = this
				if (that.buttonShow) {
					that.tableData.splice(index, 1)
					this.$forceUpdate()
				}

			},

			producplnameClick(e) {
				var that = this;
				console.log(e);
				that.tableData[that.producplnameIndex].ProductPJID = e.ProductPJID
				that.tableData[that.producplnameIndex].ProductPJName = e.ProductPJName
				this.$forceUpdate()
			},
			addproducplname(item, index) {
				var that = this;
				if (that.buttonShow) {
					that.producplnameIndex = index

					that.Request.request('getsProductPJ', {

					}, function(ret) {
						console.log(ret.data.ds);
						if (ret.status == 200) {
							ret.data.ds.map(item => item.name = item.ProductPJName)
							that.producplnameList = ret.data.ds
							that.producplnameShow = true
						}
					})
				}

			},
			StateClick(e) {
				var that = this;


				if (that.StateName == 'SBWX') {
					console.log(e.id);
					that.baseFormData.FResult = e.id
					that.baseFormData.FResultName = e.name
					that.$refs.uForm.validateField('FResultName'); // 手动触发 MaintainMan 字段的验证
					that.$forceUpdate()
				} else {

					that.baseFormData.WayName = e.name
					that.baseFormData.Way = e.id
					that.$refs.uForm.validateField('WayName'); // 手动触发 MaintainMan 字段的验证
					that.$forceUpdate()
				}
				this.$forceUpdate()


			},
			addWay(str) {
				var that = this;
				if (that.buttonShow) {
					that.StateName = str
					console.log(str);
					that.Request.request('getViewState', {
						FType: str
					}, function(ret) {
						console.log(ret.data.ds);
						if (ret.status == 200) {
							that.StateList = ret.data.ds
						}
					})
					this.StateShow = true
				}
			},
			addWay1(str) {
				var that = this;
				if (that.buttonTitle == '结束维修' && that.buttonShow) {
					that.StateName = str
					console.log(str);
					that.Request.request('getViewState', {
						FType: str
					}, function(ret) {
						console.log(ret.data.ds);
						if (ret.status == 200) {
							that.StateList = ret.data.ds
						}
					})
					this.StateShow = true
				}
			},
			addCost() {
				var that = this;
				if (that.buttonTitle == '开始维修') {
					uni.showToast({
						title: '请在结束时填写',
						icon: 'error',
						duration: 2000
					})
				}
			},


			openBaseScreen(str, type) { // 前往筛选页
				let that = this;
				let obj = null;
				let url = '/commonPage/Tool/baseScreen';
				if (that.buttonShow) {
					if (str == '维修人员') {
						obj = {
							allowClear: false,
							cmd: 'getEmplByJobName',
							type: str,
							ListeningName: 'devicerepairDetail_Choice',
							serverSearch: {
								isPaging: false, //是否分页
								searchKey: 'SearchKey', //搜索关键词，应包含在param中
								showText: 'EmplName', //查询结果显示的字段
								pageIndexStr: 'PageIndex', //分页页码字段，应包含在param中
								ChoiceDataKey: 'EmplName',
								ChoiceDataData: that.baseFormData.MaintainMan,
							},
							param: {
								SearchKey: '',
								JobName: '',
								PageIndex: 1,
								PageSize: 30
							}
						}

					} else if (str == '模具') {
						obj = {
							allowClear: false,
							cmd: 'Droplist_Molud',
							type: str,
							ListeningName: 'devicerepairDetail_Choice',
							serverSearch: {
								isPaging: false, //是否分页
								searchKey: 'SearchKey', //搜索关键词，应包含在param中
								showText: 'MoludCode', //查询结果显示的字段
								pageIndexStr: 'PageIndex', //分页页码字段，应包含在param中
								ChoiceDataKey: 'MoludID',
								ChoiceDataData: that.baseFormData.MoludID,
							},

							param: {
								SearchKey: '',
								MoludCode: '',
								PageIndex: 1,
								PageSize: 30
							}
						}

					}

					this.$store.commit('ChangeAndSetStateData', {
						Name1: 'BaseScreenParm',
						data: obj
					})
					uni.navigateTo({
						url: url
					})
				}
			},


			submit() {
				var that = this
				this.$refs.uForm.validate().then(res => {
					var obj = {
						MaintainMouldID: that.baseFormData.MaintainMouldID ? that.baseFormData
							.MaintainMouldID : 0,
						ApplyForMan: that.baseFormData.ApplyForMan,
						MoludID: that.baseFormData.MoludID,
						ApplyForTime: that.baseFormData.ApplyForTime,
						BXContent: that.baseFormData.BXContent,
						BillNO: that.baseFormData.BillNO,
						MaintainMan: that.baseFormData.MaintainMan,
						GZCause: that.baseFormData.GZCause,
						Way: that.baseFormData.Way,
						Cost: that.baseFormData.Cost ? that.baseFormData.Cost : 0,
						WCStatus: that.baseFormData.WCStatus,
						FResult: that.baseFormData.FResult,
						BeginTime: that.baseFormData.BeginTime,
						WCTime: that.baseFormData.WCTime,
						BillDate: that.baseFormData.BillDate,
						FType: 'MJWX',
					}
					console.log(obj);
					that.Request.request('saveMaintainMould', obj, function(ret) {
						console.log(ret);
						if (ret.status == 200) {
							that.$refs.uToast.show({
								title: '保存',
								type: 'success',
								message: '保存成功'
							})
							that.queryList(ret.data.ds[0].MaintainMouldID)
						}
					})
				}).catch(errors => {
					uni.$u.toast(errors[0].message)
				})

			},


			queryList(id) {
				var that = this
				try {
					var obj = {
						PageIndex: 1,
						PageSize: 30,
						FBDate: getBefore7DateTime(),
						FEDate: getFormatDateTime(new Date()),
						MaintenanceStatus: -1,
						MaintainMouldID: id
					}

					that.Request.request('getMaintainMouldListD', obj, (ret) => {
						console.log(ret.data);
						ret.data.ds.map((item) => {
							item.ApplyForTime = item.ApplyForTime ? item.ApplyForTime.split('T')[0] : ''
							item.BeginTime = item.BeginTime ? item.BeginTime.replace('T', ' ')
								.split('.')[0] : ''
							item.WCTime = item.WCTime ? item.WCTime.replace('T', ' ').split('.')[0] : ''
							item.MaintenanceStatusName = item.MaintenanceStatus ? that.getBYStatus(item
								.MaintenanceStatus) : ''
						})
						that.baseFormData = ret.data.ds[0]

						that.addPeriodTypeClick()
						that.$forceUpdate()

					})
				} catch (e) {
					console.log(e)
					this.$utils.hideLoading();
					this.$utils.msg('请求失败请重试')
				}
			},

			leftClick() {
				let routes = getCurrentPages(); //当前页面栈
				let prevPage = routes[routes.length - 2]
				prevPage.$vm.getList()
			}
		}
	}
</script>

<style lang="scss">
	.content {
		display: flex;
		flex-direction: column;
		height: 100vh;
		// height: calc(100vh - 60px);
		background-color: #f9f9f9;

		uni-button {
			margin-left: initial !important;
			margin-right: initial !important;
		}

		.MainPopup {
			flex: initial !important;

			.PopupContent {
				display: flex;
				flex-direction: column;
				min-height: 240px;
				width: 90vw;
			}

			.u-transition {
				z-index: 99999 !important;
			}


			.PopupMainBox {
				padding: 12px 10px 6px;
				flex: 1;
				// overflow: auto;

				.CellBox {
					margin-bottom: 20px;

					.LeftBox {
						font-size: 14px;
						color: #999;
						margin-right: 10px;
					}
				}

				.uni-input-placeholder {
					color: #6a6a6a !important;
					font-size: 12px !important;
				}
			}

			.PopupBottomBox {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				padding: 10px 10px;

				.CancelBtn {
					background-color: #fff;
					color: #51d0d0;
					border: 1px solid #51d0d0;
					min-width: 80px;
				}

				.ComfirmBtn {
					background-color: #51d0d0;
					color: #fff;
					min-width: 80px;
					margin-left: 10px !important;
				}
			}
		}

		.MainBox {
			flex: 1;
			overflow: auto;



			// 表单1
			.u-form {
				// padding: 0px 10px;

				.u-form-item {
					background-color: #fff;
					padding: 0 16px;
				}


				.TopOption {

					.u-form-item__body {
						flex-direction: column !important;
					}
				}

				// 起止时间
				.ChoiceTimesBox {
					width: 100%;
					display: flex;
					align-items: center;
					// background-color: #fff;
					// padding: 18px 10px;
					// margin-top: 10px;

					.TimeBox {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: space-evenly;

						.timer {
							width: 100%;
							flex: 2;
							display: flex;
							flex-direction: column;
							// align-items: center;
							font-size: 14px;
							color: #333;

							text:first-child {
								margin-bottom: 10px;
								font-weight: 600;
							}

							text:last-child {
								height: 20px;
							}
						}

						.Icon {
							flex: 1;
						}
					}
				}


				// 上传-删除图标
				.u-upload__deletable {
					width: 20px;
					height: 20px;

					.u-upload__deletable__icon {
						right: -1px !important;

						.u-icon__icon {
							font-size: 20px !important;
							line-height: 16px !important;
						}
					}
				}
			}
		}

		.BottomBox {
			width: 100%;

			padding: 6px 15px;
			border-top: 1px solid #efefef;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			background-color: #fff;


		}
	}
</style>